昨天豪氣萬千地宣布要挑戰 30 天 Vibe Coding,結果打開電腦才發現環境還沒裝
俗話說:「工欲善其事,必先利其器」
要是環境沒搞好,明天開始記帳 App 的時候,可能會直接卡在「npm 裝不起來」然後提早領便當
Cursor:AI 加持的編輯器,看似是寫程式的環境,但其實我只會用右邊的對話框
Node.js:跑 React 要用的東東
Firebase CLI:之後 Firestore(資料庫) / 部署都靠它
GitHub Repo:紀錄每天的屎山程式碼,就算把程式碼搞爆還有備份可救回
node -v
npm -v
有顯示版本號就代表成功
3. 安裝 Firebase CLI
在終端機輸入:
npm install -g firebase-tools
安裝完畢後登入 Firebase:
firebase login
會跳到瀏覽器,選擇 Google 帳號登入。登入成功後終端機會顯示 OK。
4. 建立 GitHub Repo (CUI 版)
先到 GitHub 建一個新的 Repository。
在本地專案資料夾裡輸入:
git init
git remote add origin https://github.com/你的帳號/你的repo.git
git add .
git commit -m "initial commit"
git push -u origin main
push 成功之後,就能在 GitHub 上看到今天的紀錄。
5. 建立 GitHub Repo(GUI 版)
登入 GitHub,右上角點 「+」 → New repository
填寫 repo 名稱(例如 expense-tracker),選擇私人Private
勾選 Add a README file,這樣就會自動產生一個可以直接 clone 的 repo
建立完成後,點擊綠色的 Code 按鈕,複製 HTTPS 或 SSH 的連結
在本機開啟 Cursor/VSCode,選 Clone Repository,貼上剛剛的連結
成功後,你的專案就會直接同步到 GitHub,之後在 VSCode/Cursor 用 Commit & Push 就能更新
如果不想用 VSCode 內建 Git,也可以安裝 GitHub Desktop:
開啟 GitHub Desktop → File → Clone repository
選擇剛剛建立的 repo
以後只要 Commit → Push origin 就能把程式碼更新上去,介面化操作更直覺
今日驗收 ✅
明日預告
Day 3 正式開始做第一個專案 —— 記帳 App
先做個 MVP,能輸入一筆消費,按下去出現在列表上。看看明天能不能至少知道我的錢錢花去哪了
就這樣,Day 2 完美落幕